<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <title>index.html</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index1.css">

</head>
<body>
<div class="header">
    <div class="h-top">
        <div class="h-top1">
            <img src="images/图书---豆瓣_01.jpg" alt="">
            <div>
                <span class="wz1">豆瓣App</span><br>
                <span class="wz2">记录你的影音生活</span>
            </div>
        </div>
        <div class="h-top2">
            <span class="wz3">打开App</span>

        </div>

    </div>
</div>
<div class="bottom">
    <div class="b-bottom1">
        <span class="wz4">最受关注图书类 | 虚构类</span>
        <span class="wz5"><a href="#">更多</a></span>
    </div>
    <div class="b-bottom2">
        <ul>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_22.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_23.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_24.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_25.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_26.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_27.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/最受关注图书｜虚构类---豆瓣_28.jpg" alt=""></a></li>
        </ul>
    </div>
</div>
</body>
</html>